
$(function(){
        // 登录等出
        const nickname = getCookie('nickname')
        console.log(nickname)
        if(nickname){
          $('.off').addClass('hide')
          $('.bind-off').addClass('hide')
          $('.qq-off').addClass('hide')
          $('.on').removeClass('hide').html(`欢迎您，${nickname} &nbsp;&nbsp;<a href='' title="登录">退出</a>`)
          $('.qq-on').removeClass('hide').html(`<img src="../img/list/zb-list.jpg" alt="" class="lf">
          <p>
          ${nickname}
          </p>`)
          $('.bind-on').removeClass('hide')
          $('.on > a').on('click',function(){setCookie('nickname',nickname,-1);console.log('11')})
          setCartNum()
        }else{
          alert("请先登录")
          window.location.href = '../pages/login.html'
          
          $('.bind-on').addClass('hide')
          $('.bind-off').removeClass('hide')
          $('.on').addClass('hide')
          $('.qq-on').addClass('hide')
          $('.off').removeClass('hide')
          $('.qq-off').removeClass('hide')
        }
    
        // 购物车
        function setCartNum() {
          // 拿到 localStorage 里面的那个数组
          
          const cart = JSON.parse(window.localStorage.getItem('cart')) || []
          // 3-2. 判断 cart 是一个 [], 那么就用 0 填充到指定位置
          if (!cart.length) {
            $('.car-Num').html('0')
            return
          }
        
          // 3-3. 能来到这里, 表示购物车里面有数据
          // 需要把每一条数据的 cartNum 叠加咋一起
        //   console.log($('asdb'))
          let count = 0
          cart.forEach(item => count += item.cart_number - 0)
        //   count += ')'
          console.log($('.car-Num'))
          $('.car-Num').html(count)
        }
        const cart = JSON.parse(window.localStorage.getItem('cart')) || []
        if (!cart.length) {
            // 表示购物车没有数据
            // 购物车列表添加 hide 类名, 进行隐藏
            $('.buycar-on').addClass('hide')
            $('.buycar-off').removeClass('hide')
            return
        }
        
            // 3. 能来到这里表示 cart 里面有数据
            // 就要进行渲染了
        $('.buycar-off').addClass('hide')
        $('.buycar-on').removeClass('hide')
        // 渲染商品
        bindHtml()
        function bindHtml() {
        // 5. 进行一些数据的准备
        // 5-1. 决定全选按钮是不是选中
        // every()

            const selectAll = cart.every(item => item.is_select === '1')
            // 5-2. 计算选中的商品数量和价格
            let total = 0
            let totalMoney = 0
            cart.forEach(item => {
            if (item.is_select === '1') {
                total += item.cart_number - 0
                totalMoney += item.cart_number * item.qb_pric
            }
            })
            // let lotNum = (cart[0].qb_pric - 0 )* (cart[0].cart_number - 0) 
            
            let str = `
            <thead>
                <tr>
                    <th>
                    <input class="ico-check ico-all" type="checkbox" ${ selectAll ? 'checked' : '' }>
                        全选
                    </th>
                    <th>商品名称</th>
                    <th>类型</th>
                    <th>价格</th>
                    <th>期限</th>
                    <th style="width: 110px;">数量</th>
                    <th>优惠</th>
                    <th>小计</th>
                    <th>操作</th>
                </tr>
            </thead>
            `
            cart.forEach(item => {
                str += `
                <tbody>
                <tr>
                    <th>
                        <input class="ico-check" data-id="${ item.Id }" type="checkbox" ${ item.is_select === '0' ? '' : 'checked' }>
                    </th>
                    <td style="text-align: left;">
                        <img src="${ item.img }" alt="">
                        <a href="#">${ item.name }</a>
                    </td>
                    <td>
                        皮肤
                    </td>
                    <td>
                    ${ item.qb_pric }${ item.qb_word }
                    </td>
                    <td>
                        永久
                    </td>
                    <td>
                        <a class="buy-minu" data-id="${ item.Id }" style="cursor: pointer;margin-left: 20px;">-</a>
                        <input type="text" class="buy-amount" value="${ item.cart_number }">
                        <a class="buy-plus" data-id="${ item.Id }" style="cursor: pointer;">+</a>
                    </td>
                    <td>无优惠</td>
                    <td>${ (item.qb_pric * item.cart_number).toFixed(2) }</td>
                    <td><a data-id="${ item.Id }" class="clear blu">删除</a></td>
                </tr>
            </tbody>
                `
              })
            let bt = `
                    <span>${ totalMoney } Q币</span>
                    `

            $('.buycar-on').html(str)
            $('.num-comon').html(bt)
        }

        $('.buycar-on').on('click', '.ico-check', function () {
            // 拿到当前标签的状态
            const type = this.checked
            
            // 拿到当前标签的 id
            const id = $(this).data('id')
            // 去 cart 里面找到 id 对应的数据, 把 is_select 修改一下
            const info = cart.filter(item => item.Id == id)[0]
            info.is_select = type ? '1' : '0'
            
            // 从新渲染页面
            bindHtml()
            // 把最新的 cart 存起来
            window.localStorage.setItem('cart', JSON.stringify(cart))
          })

          $('.buycar-on').on('click', '.buy-plus', function () {
            // 拿到商品 id
            const id = $(this).data('id')
            // 找到 cart 中的对应商品
            const info = cart.filter(item => item.Id == id)[0]
            // 修改信息
            info.cart_number = info.cart_number - 0 + 1
            // 重新渲染页面
            bindHtml()
            // 从新保存起来
            window.localStorage.setItem('cart', JSON.stringify(cart))
            setCartNum()
          })

          $('.buycar-on').on('click', '.buy-minu', function () {
            // 拿到商品 id
            const id = $(this).data('id')
            // 找到 cart 中的对应商品
            const info = cart.filter(item => item.Id == id)[0]
            // 判断 info 内的 cart_number 如果已经是 1 了, 就什么都不做了
            if (info.cart_number === 1) return
            // 修改信息
            info.cart_number = info.cart_number - 0 - 1
            // 重新渲染页面
            bindHtml()
            // 从新保存起来
            window.localStorage.setItem('cart', JSON.stringify(cart))
            setCartNum()
          })

        $('.buycar-on').on('click','.clear',function(){
            const id = $(this).data('id')
            // 删除指定数据
            for (let i = 0; i < cart.length; i++) {
                if (cart[i].Id == id) {
                    cart.splice(i, 1)
                    break
                }
            }
            bindHtml()
            
            
            // 从新保存起来
            window.localStorage.setItem('cart', JSON.stringify(cart))
            
            if (!cart.length) return window.location.reload()
            setCartNum()
        })
        
})